<template>
    <div>
          <table>
               <tr>
                    <td>用户名</td>
                    <td>
                        <input type="text" v-model="data.Yname">
                    </td>
               </tr>
                <tr>
                    <td>联系方式</td>
                    <td>
                         <input type="text" v-model="data.Ylxfs">
                    </td>
               </tr>
                <tr>
                    <td>证件类型</td>
                    <td>
                        <select v-model="data.Yzjlx">
                            <option value="身份证">身份证</option>
                            <option value="军官证">军官证</option>
                            <option value="护照">护照</option>
                        </select>
                    </td>
               </tr>
                <tr>
                    <td>证件号码</td>
                    <td>
                         <input type="text" v-model="data.Yzjhm">
                    </td>
               </tr>
                <tr>
                    <td>性别</td>
                    <td>
                          <input type="radio" name="hhh" value="男" v-model="data.Yxb">男
                          <input type="radio" name="hhh" value="女" v-model="data.Yxb">女
                    </td>
               </tr>
                <tr>
                    <td>生日</td>
                    <td>
                        <input type="date" v-model="data.Ysr">
                    </td>
               </tr>
                <tr>
                    <td>职业类型</td>
                    <td>
                        <select v-model="data.Ylxid">
                            <option v-for="d in xl" :value="d.Lid">{{d.Lname}}</option>
                        </select>
                    </td>
               </tr>
                <tr>
                    <td>状态</td>
                    <td>
                          <input type="radio" name="kkk" value="0" v-model="data.Yzt">启用
                          <input type="radio" name="kkk" value="1" v-model="data.Yzt">禁用
                    </td>
               </tr>
                <tr>
                    <td>地址</td>
                    <td>
                         <input type="text" v-model="data.Ydz">
                    </td>
               </tr>
                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="添加" @click="add">
                    </td>
               </tr>
          </table>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios'
import {ref,onMounted} from 'vue'
import {useRouter} from 'vue-router'

const route = useRouter();


const data = ref({
  "Yid": 0,
  "Yname": "",
  "Ylxfs": "",
  "Yzjlx": "",
  "Yzjhm": "",
  "Yxb": "",
  "Ysr": "",
  "Ylxid": 0,
  "Yzt": 0,
  "Ydz": ""
})

const add = ()=>{

      if(data.value.Yname == ""){
            alert("用户名不能为空!");
            return;
        }
          if(data.value.Ylxfs == ""){
            alert("联系方式不能为空!");
            return;
        }
          if(data.value.Yzjhm == ""){
            alert("证件号码不能为空!");
            return;
        }
          if(data.value.Ydz == ""){
            alert("地址不能为空!");
            return;
        }

    axios.post("https://localhost:7196/api/ZK/Add",data.value).then(res=>{
        if(res.data>0){
            alert("添加成功!");
            route.push("/Show");
        }
        else{
            alert("添加失败");
        }
    })
}

onMounted(()=>{
    Bang();
})

const xl = ref([{
    "Lid": 1,
    "Lname": "老师"
}])

const Bang=()=>{
    axios.get("https://localhost:7196/api/ZK/Bang").then(res=>{
        xl.value = res.data
    })
}
</script>

<style scoped>

</style>